<template>
	<div class="comter">
		<div v-if="is_adopt">
			<div class="bj">
				<div class="top">
					<div class="topname">
						<span>用户昵称</span>
					</div>
					<div class="md">
						<div class="mditem">
							<img
								src="../../static/user/dmp.png"
								alt
							/>
							<span>门店数</span>
							<span style="font-size:0.4rem;">12</span>
						</div>
						<div
							class="mditem"
							@click="ewm = true"
						>
							<span style="padding-right:0.2rem;">二维码</span>
							<img
								src="../../static/user/rwms.png"
								alt
							/>
						</div>
					</div>
				</div>
			</div>
			<div class="tj">
				<!-- <div>
          <span style="font-size:0.35rem;color:#999"></span>
        </div>-->
				<div class="tjsl">
					<div
						style="padding:0.3rem 0rem;"
						class="item_tj"
					>
						<div>
							<span class="sz">{{conversion_rate.weekConversionRate}}</span>
						</div>
						<div style="font-size:0.26rem;">
							<span>周转化率</span>
						</div>
					</div>
					<div
						style="padding:0.3rem 0rem;"
						class="item_tj"
					>
						<div>
							<span class="sz">{{conversion_rate.monthConversionRate}}</span>
						</div>
						<div style="font-size:0.26rem;">
							<span>月转化率</span>
						</div>
					</div>
					<div
						style="padding:0.3rem 0rem;"
						class="item_tj"
					>
						<div>
							<span class="sz">{{conversion_rate.weekCount}}</span>
						</div>
						<div style="font-size:0.26rem;">
							<span>总浏览量</span>
						</div>
					</div>
				</div>
			</div>

			<div
				class="lists"
				v-if="show_business_list"
			>
				<div class="sylist">
					<img
						src="../../static/user/wwsy.png"
						alt
					/>
					<span style="color:#999">我的商户</span>
				</div>
				<yd-infinitescroll
					:distance="20"
					:callback="get_business_lately_list"
					ref="business_lately"
				>
					<div
						class="syy"
						slot="list"
					>
						<div
							class="syitemss"
							v-for="item in business"
							v-bind:key="item.id"
						>
							<div class="shlogo">
								<img
									:src="item.logo"
									alt
								/>
							</div>
							<div class="shinfo">
								<div>
									<span>{{item.business_name}}</span>
								</div>
								<div class="infos">
									<span>地址：</span>
									<span>{{item.address}}</span>
								</div>
								<div class="infos">
									<span>评分：</span>
									<span>{{item.score}}</span>
								</div>
							</div>
						</div>
					</div>
					<span slot="doneTip">没有更多了</span>
				</yd-infinitescroll>
			</div>
			<div v-else>暂无商家信息</div>
			<yd-popup
				v-model="ewm"
				position="center"
				width="90%"
			>
				<div class="comewm">
					<div class>
						<img
							:src="qr_code"
							alt
						/>
					</div>
				</div>
			</yd-popup>
		</div>
		<examine v-if="is_wait_review"></examine>
		<apply
			v-if="is_not_shop_manage"
			:apply_type="apply_type"
		></apply>
	</div>
</template>
<script>
import apply from "@/components/examine_role/nocen";
import examine from "@/components/examine_role/noshy";

export default {
	name: "agentshop",
	components: {
		apply,
		examine
	},
	data () {
		return {
			is_load_finish:false,
			shop_manger_status: "",
			ewm: false,
			qr_code: '',
			apply_type: 'T',
			Shop_manager: {
				nickname: "小胖子"
			},

			conversion_rate: {
				monthConversionRate: 0,
				weekConversionRate: 0,
				weekCount: 0
			},
			business: []
		};
	},
	computed: {
		/*
		 * 显示商家列表
		 * 作者：gzt
		 * 时间：2019-11-29 16:38:45
		 */
		show_business_list () {
			if (this.business.length > 0) {
				return true;
			}
			return false;
		},
		is_adopt(){
			if(this.is_load_finish&&this.shop_manger_status=='ADOPT'){
				return true
			}
			false
		},
		is_wait_review(){
			if(this.is_load_finish&&this.shop_manger_status=='WAIT_REVIEW'){
				return true
			}
			false
		},
			is_not_shop_manage(){
			if(this.is_load_finish&&this.shop_manger_status=='REFUSE'){
				return true
			}
			false
		},
		
	},
	mounted () {
		this.shop_manage_status()
	},
	methods: {
		/*
		 * 获取探店官的详细信息
		 * 作者：gzt
		 * 时间：2019-11-29 14:28:48
		 */
		get_shop_manager () {
			let _this = this;
			this.$post(this.$api.account.shop_manager).then(res => {
				if (res.success) {
					// 探店官的基本信息
					_this.shop_manager = { ...res.data.user };
					// 商家信息
					if (res.data.bussines && res.data.bussines.length > 0) {
						for (let business_item of res.data.bussines) {
							_this.business.push({
								id: business_item.bussinesId,
								logo: business_item.logoUrl,
								business_name: business_item.name,
								address: "",
								score: business_item.score
							});
						}
					}
				}
			});
		},
		/*
		* 探店官的状态
		* 作者：gzt
		* 时间：2019-11-30 13:03:49
		*/
		shop_manage_status () {
			let _this = this
			this.$post(this.$api.account.shop_manager_status, {
				managerId: '0e72759c8a124b2ba274d21b1f402cf7'
			})
				.then(res => {
					_this.is_load_finish=true
					if (res.success) {
            console.log(res)
						_this.shop_manger_status = res.data.status
						if (_this.shop_manger_status == 'ADOPT') {
							_this.get_shop_manager()
							_this.get_qr_code()
							_this.shop_manager_conversion_rate()
						}
					}
				});
		},

		/*
		* 获取二维码信息
		* 作者：gzt
		* 时间：2019-11-30 13:12:48
		*/
		get_qr_code () {
			let _this = this
			this.$post(this.$api.account.qr_code, {
				code: 'http://test.menglaide.com/zhuce'
			})
				.then(res => {
					if (res.success) {
						_this.qr_code = res.data
					}
				});
		},

		/*
		* 探店官的转化率
		* 作者：gzt
		* 时间：2019-11-30 13:16:13
		*/
		shop_manager_conversion_rate () {
			let _this = this
			this.$post(this.$api.account.shop_manager_conversion_rate, {
				userId: 28
			})
				.then(res => {
					if (res.success) {
						_this.conversion_rate = { ...res.data }
					}
				});
		}
	}
};
</script>
<style>
.comter {
	height: 100%;
}
.bj {
	height: 3.2rem;
	background: url('../../static/user/tdg.png');
	background-size: 100% 100%;
}
.topname {
	text-align: left;
	font-size: 0.5rem;
	padding: 0.5rem 0.75rem 0rem 0.65rem;
	color: #fff;
}
.md {
	display: flex;
	padding: 0.15rem 0.5rem;
	color: #fff;
}
.mditem {
	width: 50%;
	display: flex;
	padding: 0rem 0.2rem;
	justify-content: flex-start;
	align-items: center;
}
.mditem img {
	height: 0.35rem;
	padding-right: 0.2rem;
	display: flex;
}

.tj {
	background: #fff;
	margin: 0.35rem;
	border-radius: 5px;
	box-shadow: 1px 5px 10px 1px #d0d1d2;
	position: relative;
	top: -1.5rem;
	text-align: left;
	padding: 0.3rem 0.4rem;
}
.sz {
	color: #369fff;
	font-size: 0.6rem;
	font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
.sj {
	display: flex;
	justify-content: space-between;
	padding: 0.35rem;
	margin-top: -1.8rem;
}
.mk {
	height: 1.8rem;
	border-radius: 5px;
	width: 3.2rem;
	font-size: 0.35rem;
	color: #fff;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
}
.blue {
	background-image: linear-gradient(to right, #54d4ff, #369fff);
}
.zs {
	background-image: linear-gradient(to right, #a965e6, #823eb5);
}
.lists {
	background: #fff;
	border-radius: 5px;
	margin: -1.6rem 0.35rem 1rem 0.35rem;
}
.sylist {
	font-size: 0.35rem;
	padding: 0.3rem 0.4rem;
	display: flex;
}
.sylist img {
	height: 0.5rem;
	padding-right: 0.2rem;
}
.listsy {
	padding: 0rem 0.2rem;
}
.syitem {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.05rem 0rem;
}
.syitem div {
	height: 0.6rem;
	display: flex;
	align-items: center;
	width: 33%;
	justify-content: center;
	color: #999;
}
.xz {
	background: #f5f5f5;
}
.tl {
	font-weight: bold;
	font-size: 0.28rem;
}
.comewm {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	height: 5rem;
}
.comewm img {
	height: 100%;
	width: 100%;
}

.syy {
	padding: 0rem;
}
.syitemss {
	display: flex;
	text-align: left;
	align-items: center;
	font-size: 0.28rem;
	border-bottom: 1px solid #f5f5f5;
	margin: 0.3rem;
	padding-bottom: 0.2rem;
}
.shlogo {
	width: 1.4rem;
	display: flex;
	align-items: center;
}
.shlogo img {
	height: 1.1rem;
	border-radius: 3px;
}

.shinfo {
	flex: 1;
}
.info {
}
.infos {
	color: #999;
}
.sys {
	color: red;
	width: 1rem;
	text-align: right;
}
.tjsl {
	display: flex;
	justify-content: space-between;
}
.item_tj {
	width: 33%;
	text-align: center;
}
</style>
